@import "@/theme.less";
#send-nav{
  position: fixed;
  z-index: 10;
  top:0;
  left:0;
  width: 375px;
  height: 100%;
  background: rgba(0,0,0,.5);
  transform-origin: 50% 95%;
  transition:.2s;
  transition-timing-function:ease-in;
  &.close{
    transform: scale(0);
    opacity:0;
  }
  &.open{
    transform: scale(1);
    opacity:1;
  }
  .content{
    position: absolute;
    left:0;
    bottom:100px;
    width: 375px;
    display:flex;
    justify-content:space-around;
    .child{
      width: 100px;
      height: 130px;
      .icon{
        position: relative;
        width: 100px;
        height: 100px;
        border-radius: 50px;
        background: @page-bg;
        svg{
          position: absolute;
          left: 50%;
          top:50%;
          transform: translate(-50%,-50%);
          width: 60px;
          height: 60px;
        }
      }
      p{
        height: 30px;
        line-height: 30px;
        text-align: center;
        color: @page-bg;
        font-size: @font-middle;
      }
    }
  }
}
#send-btn{
  position: fixed;
  z-index: 10;
  bottom: 35px;
  left:165px;
  width: 45px;
  height: 45px;
  line-height: 45px;
  border-radius: 22.5px;
  background: @main-color1;
  text-align: center;
  color: #fff;
  transition:.2s;
  i{
    font-size: @font-huge;
  }
  &.close{
    transform: rotate(0);
  }
  &.open{
    transform: rotate(45deg);
  }
}
